import React from 'react';
import { observer, inject } from 'mobx-react';
import { Icon,Tools ,Bubble, Flex } from 'weaver-mobile';
import { withRouter } from 'react-router-dom';
import { RouteLayout } from 'weaver-mobile-page';

const getLabel = Tools.getLabel;

@inject('viewMeetingStore')
@inject('meetingSearchStore')
@inject('calendarStore')
@withRouter
@observer
class Footer extends React.Component {

  componentDidMount() {
    const { getRequestParams } = this.props.viewMeetingStore;
    getRequestParams();
  }

  componentWillUpdate(nextProps){
    const { location: { pathname: nextP }, history: h } = nextProps;
    const { location: { pathname: p } } = this.props;
    if(h.action === 'POP' && (p.indexOf('createRequest') > -1 || p.indexOf('addRequest') > -1)){
      if(window.em){
        window.em.checkJsApi('changeTitle') && window.em.changeTitle({title:sessionStorage.meetingTitle?sessionStorage.meetingTitle:getLabel(32483, '会议日历')})
      }
    }
  }

  openMyCalendar = ()=>{
    sessionStorage.setItem('meetingTitle',getLabel(32483, '会议日历'))
    const { selectdate, setState } = this.props.calendarStore;
    setState({
      selectUserId:'',
      roomUsedSelectDate: ''
    });
    if(window.em){
      window.em.checkJsApi('changeTitle') && window.em.changeTitle({title:getLabel(32483, '会议日历')})
    }
    this.props.history.push('/calendar/allMeeting');
    sessionStorage.removeItem('meetingSelectUserId');
    sessionStorage.setItem('meetingRoomPlanDate',selectdate);
  }

  getDetail(params){
    const { selectdate,setState } = this.props.calendarStore;
    setState(...params)
    this.getCalendarList({selectdate:selectdate,...params});
    this.getCalendarInfo({selectdate:selectdate,...params});
  }

  getCalendarInfo(params){
    const { getCalendarInfo,meetingType } = this.props.calendarStore;
    getCalendarInfo({ismobile:1,viewType:'3',isCalendar:'1',meetingType:meetingType,...params});
  }

  getCalendarList(params){
    const { getCalendarInfo,meetingType } = this.props.calendarStore;
    getCalendarInfo({ismobile:1,viewType:'1',isCalendar:'0',meetingType:meetingType,...params});
  }

  openRoomPlan = ()=>{
    const { selectdate } = this.props.calendarStore;
    // const pathName = this.props.history.location.pathname;
    this.props.history.push({pathname:`/calendar/allMeeting/report`,query:{selectDate:selectdate}});
    // this.props.history.push({pathname:`${pathName}/report`,query:{selectDate:selectdate}});
  }

  isActive = (type) => {
    const { pathname } = this.props.location;
    let style = '';
    let isReport = (pathname === '/calendar/allMeeting/report' || pathname === '/calendar/allMeeting/report/roomPlan');
    if(type === 'mycalendar') {
      if ( isReport ) {
      } else {
        style = 'active';
      }
    } else if (type === 'report') {
      if ( isReport ) {
        if (pathname.indexOf('roomPlan') > -1) {} else {
          style = 'active';
        }
      } else {
      }
    }
    return style;
  }

  openWorkflowByParams = (URL) => {
    const _this = this;
    if(window.openLink && window.openLink.openWorkflowByParams) {
      window.openLink.openWorkflowByParams(URL, () => {
        _this.getDetail({});
      })
    } else {
      alert('openWorkflowByParams--error');
    }
  }

  openWorkflow = (URL) => {
    const _this = this;
    if(window.openLink && window.openLink.openWorkflow) {
      window.openLink.openWorkflow(URL, () => {
        _this.getDetail({});
      })
    } else {
      alert('openWorkflow--error');
    }
  }

  createMeeting = ()=>{
    const { onlyFlowCreate, hideCreateEntry, workflowBaseIds,addRequestUrlParams } = this.props.viewMeetingStore;
    let workflowBaseIdsArr = workflowBaseIds.split(',')
    if(hideCreateEntry == 1){
      return;
    }else if(onlyFlowCreate === 1 && hideCreateEntry === 1){
      Bubble.error(getLabel(510049, '请通过流程新建会议！'), 3);
    }else if(onlyFlowCreate === 1 && hideCreateEntry === 0 && workflowBaseIdsArr.length === 1 && workflowBaseIdsArr[0] === ''){
      Bubble.error(getLabel(510148, '系统查找不到新建会议流程！'), 3);
    }else if(onlyFlowCreate === 1 && hideCreateEntry === 0 && workflowBaseIdsArr.length === 1){
      let url =`/spa/workflow/static4mobileform/index.html#/req?iscreate=1&src=meeting&workflowid=${workflowBaseIds}${addRequestUrlParams}`
      url =`iscreate=1&src=meeting&workflowid=${workflowBaseIds}${addRequestUrlParams}`
      this.openWorkflowByParams(url);
      // this.props.history.push({pathname:`/calendar/meeting/createRequest`,query:{iscreate:'1',workflowid:workflowBaseIds}});
      // window.location.href=`/spa/workflow/static4mobileform/index.html#/req?iscreate=1&src=meeting&workflowid=${workflowBaseIds}${addRequestUrlParams}`
    }else if(onlyFlowCreate === 1 && hideCreateEntry === 0 && workflowBaseIdsArr.length > 1){
      let url =`/spa/workflow/static4mobile/index.html#/add?isNeedTab=0&src=meeting&wfRange=${workflowBaseIds}${addRequestUrlParams}`
      this.openWorkflow(url);
      // window.location.href=`/spa/workflow/static4mobile/index.html#/add?isNeedTab=0&src=meeting&wfRange=${workflowBaseIds}${addRequestUrlParams}`
      // this.props.history.push({pathname:`/calendar/meeting/addRequest`,query:{isNeedTab:0,wfRange:workflowBaseIds}});
    }else{
      this.props.history.push({pathname:`/calendar/detail`,query:{meetingid:'',type:'create'}});
    }
  }

  render() {
    const { hideCreateEntry,workflowBaseIds,addRequestUrlParams } = this.props.viewMeetingStore;
    return(
      <div className="meeting-calendar-foot-container">
        <Flex className="calendar-foot-div" module={'meeting_mobile'} align={'start'}>
          <Flex.Item className={sessionStorage.meetingSelectUserId? 'my-meeting': `my-meeting ${ this.isActive('mycalendar') }` } onClick={this.openMyCalendar} >
            <div>
            <Icon className='icon' type={'my-meeting'} size='lg' />
            </div>
            <div><span>{getLabel(2102, '我的会议')}</span></div>
          </Flex.Item>
          <Flex.Item className={'add-icon-div'}>
            {hideCreateEntry!==1&&<Icon className='icon' type={'blog-gengduo'} size='lg' onClick={() => {
              const {setState} = this.props.viewMeetingStore;
              setState({is_create: true,is_service: true,is_topic:true}); // 清空因查看会议后再新建会议时表单中的数据
              sessionStorage.setItem('type','create');
              sessionStorage.removeItem('meetingId');
              sessionStorage.removeItem('meetingName'); 
              this.createMeeting();
            }} />}
          </Flex.Item>
          <Flex.Item className={`meeting-room ${ this.isActive('report') }`}  onClick={this.openRoomPlan} >
            <div>
              <Icon className='icon' type={'blog-report-form'} size='lg'/>
            </div>
            <div><span>{getLabel(15101, '报表')}</span></div>
          </Flex.Item>
          {/* <RouteLayout.Frame
            id="createRequestFrame"
            path={'/calendar/meeting/createRequest'}
            iframeProps={{
              src: `/spa/workflow/static4mobileform/index.html#/req?iscreate=1&src=meeting&workflowid=${workflowBaseIds}${addRequestUrlParams}`,
            }}
          />
          <RouteLayout.Frame
            id="addRequestFrame"
            path={'/calendar/meeting/addRequest'}
            iframeProps={{
              src: `/spa/workflow/static4mobile/index.html#/add?isNeedTab=0&src=meeting&wfRange=${workflowBaseIds}${addRequestUrlParams}`,
            }}
          /> */}
        </Flex>
      </div>
    );
  }
}

export default Footer;